<template>
    <div ref="parent" class="gameMap">
        <canvas ref="canvas" tabindex="0">

        </canvas>
    </div>
</template>
<script>

import { GameMap} from '@/assets/scripts/gameMap'
//onMounted 挂载完需要执行哪些操作
import { ref, onMounted} from 'vue'
export default {
    setup() {
        let parent = ref(null);
        let canvas = ref(null);
        onMounted(() => {
            new GameMap(canvas.value.getContext('2d'), parent.value);
        });
        return {
            parent,
            canvas
        }     
    },
}
</script>
<style scoped>

    div.gameMap{
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
</style>